<script setup>
const headers = ref([
  {
    label: '姓名',
    key: 'name',
    tdcomponentsName: 'greyBg',
    style: {
      width: '160px',
      textAlign: 'left'
    },
    textAlign: 'left',
    height: '68px'
  },
  { label: '年龄', key: 'age' },
  { label: '性别', key: 'gender' },
  {
    label: '爱好',
    key: 'love',
    style: {
      width: '50px'
    },
  }
])
const items = ref([
  {
    name: '张三',
    age: 18,
    gender: '男'
  },
  {
    name: '李四',
    age: 20,
    gender: '男'
  },
  {
    name: '倾国',
    age: 16,
    gender: '女',
    love: 'xxxxxxxxxxxxxxxx\nxxxxxxxxxxxxxxxxxxxxxxxxxxxx\nxxxxx'
  }
])
</script>

<script>
export default {
  name: 'table',
}
</script>

<template>
  <div class="tableContainer">
    <ZNlTable :headers="headers" :items="items" />
  </div>
</template>

<style scoped lang="scss">
.tableContainer {}
</style>
